<template>
  <Header></Header>
  <div class="article-container">
    <div class="path-container">
      <div class="path">
        <ul>
          <li>
            <a href="/">首页</a>
          </li>
          <li class="gt">&gt;</li>
          <li v-for="(item,index) in typeList" :key="index">
            <a href="javascript:void(0);" class="navigation_style" @click="goList(item.typeId)">{{ item.typeName }}</a>
          </li>
          <li class="gt">&gt;</li>
          <li class="current">
            <a href="javascript:void(0);" class="navigation_style">{{ articleModel.title }}</a>
          </li>
        </ul>
      </div>
    </div>
    <div class="article-title-container">
      <div class="article-title">{{ articleModel.title }}</div>
      <div class="article-tip">发布时间：<i class="fa fa-calendar"
                                           aria-hidden="true"></i>&nbsp;{{
          parseTime(articleModel.createTime, '{y}.{m}.{d}')
        }}&nbsp;&nbsp;|&nbsp;&nbsp;
        浏览次数：<i class="fa fa-eye" aria-hidden="true"></i>&nbsp;{{ articleModel.views }}
      </div>
    </div>
    <hr/>
    <div class="article-content">
      <div class="article-content-left" v-html="articleModel.content">
      </div>
      <div style="clear: both;"></div>
    </div>
  </div>
  <Footer></Footer>
</template>

<style scoped>

</style>
<script setup lang="ts">
import {ref} from "vue";
import Header from "@/views/components/header.vue";
import Footer from "@/views/components/footer.vue";
import {selectArticleDetail} from "@/api/article";
import {parseTime, cutString} from '@/utils/linyang'
import {useRouter} from "vue-router";
import {selectTypePath} from '@/api/type'

const _router = useRouter();
//console.log(_router.currentRoute.value.query);//获取传参数

const articleModel = ref({});
let params = {
  typeId: _router.currentRoute.value.query.typeId,
  articleId: _router.currentRoute.value.query.articleId
}

selectArticleDetail(params).then(res => {
  articleModel.value = res.data;
  //console.log(articleModel.value);
});

const typeList = ref([]);

selectTypePath(_router.currentRoute.value.query.typeId).then(res => {
  typeList.value.push(res.data);
  //console.log(typeList.value);
});


const goList = (typeId) => {
  _router.push({
    name: 'articleList',
    query: {typeId}
  });
}


</script>